<template>
    <div v-if="!hasPerms('customer:student:see')">
        <div class="head">
            <h1>学生姓名</h1>
        </div>
         <div class="second-contain-box ma">
            <el-row>
                <el-col :span="12"><span>跟进次数：</span><span>{{stuTableData.studentInfo.trackingNum}}</span></el-col>
                <el-col :span="12"><span>跟进时间：</span><span>{{saveData.contractDate}}</span></el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                 <div class="inputbox">
                    <span>联系人：</span>
                    <el-input placeholder="请输入内容" v-model="saveData.contactPeople"></el-input>
                  </div>
                </el-col>
                <el-col :span="12">
                  <span>沟通形式：</span>
                   <el-select v-model="saveData.contractType" placeholder="请选择">
                      <el-option
                        v-for="item in student_communication_type"
                        :key="item.value"
                        :label="item.value"
                        :value="item.key">
                      </el-option>
                    </el-select>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                  <span>客户类型：</span>
                    <el-select v-model="saveData.customerType" placeholder="请选择">
                      <el-option
                        v-for="item in student_type_options"
                        :key="item.value"
                        :label="item.value"
                        :value="item.key">
                      </el-option>
                    </el-select>
                </el-col>
                <el-col :span="12">
                  <span>客户进展：</span>
                    <el-select v-model="saveData.customerProgress" placeholder="请选择">
                      <el-option
                            v-for="item in student_progress_options"
                            :key="item.value"
                            :label="item.value"
                            :value="item.key">
                      </el-option>
                      </el-select>
                  </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                   <div class="inputbox">
                      <span>沟通内容：</span>
                      <el-input
                        type="textarea"
                        :rows="2"
                        placeholder="请输入内容"
                        v-model="saveData.contractContent">
                      </el-input>
                   </div>  
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12"><span>跟进人：{{trackingPeople}}</span></el-col>
                <el-col :span="12">
                  <span>下次跟进日期：</span>
                   <el-date-picker
                      v-model="saveData.nextContractDate"
                      type="datetime"
                      placeholder="选择日期时间"
                      value-format="yyyy-MM-dd HH:mm:ss" 
                      format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                  </el-col>
            </el-row>
        </div>
        <!-- <kt-button class="stu-btn" :label="$t('action.close')" perms="" size="medium" @click="handleClose()" /> -->
        <kt-button class="stu-btn" :label="$t('action.save')" perms="true" size="medium" @click="handleSave()" />
    </div>
</template>
<script>
import { hasPermission } from "@/permission/index.js";
import axios from "axios";
import KtButton from "@/views/Core/KtButton";
import api from "@/http/api";
import CrmTable from "@/views/Core/CrmTable";
import Cookies from "js-cookie"
export default {
  name: "AddStudentFollow",
  components: {
    KtButton,
    CrmTable
  },
  data() {
    return {
      filters: {
        name: ""
      },
      // 客户跟进数据
      pageResult: {},
      pageRequest: { pageNum: 1, pageSize: 8 },
      stuTableData: {},
      saveData:{
        customerType:'',
        contractDate:'',
        customerProgress:'',
        contractContent:'',
        nextContractDate:'',
        contactPeople:'',
        studentId:this.$route.query.id
      },
      trackingPeople:Cookies.get('realName'),
      student_communication_type:[],
    };
  },
  watch: {
    // $route: "getParams"
  },
  beforeMount: function() {
  },
  methods: {
    hasPerms: function(perms) {
      // 根据权限标识和外部指示状态进行权限判断
      return hasPermission(perms) & !this.disabled;
    },
    handleClose() {
      this.$router.push({ path: "/Mycustomer/Student" });
    },
    // 获取分页数据
    get_page_data: function() {
      this.$api.student
        .studentQueryInfo({
          id:this.$route.query.id
        })
        .then(res => {
          this.stuTableData=res
        })
    },
    handleFollow(params) {
      this.followdata = Object.assign({}, params.row);
    },
    // 保存跟进数据
    handleSave(){
      this.$api.student.addstudentTracking(this.saveData).then(res=>{
        if(res.result!=1){
          this.$message({
              message: res.msg,
              type: 'error'
          })
        }else{
          this.$message({
              message: res.msg,
              type: 'success'
          })
        }
      })
    },
    get_student_type() {
      this.$api.user.optionsList({ codeType: "student_type" }).then(res => {
        this.student_type_options = res.keyValueList;
      });
    },
    get_student_progress() {
      this.$api.user.optionsList({ codeType: "student_progress" }).then(res => {
        this.student_progress_options = res.keyValueList;
      });
    },
    get_contractType(){
      this.$api.user.optionsList({ codeType: "student_communication_type" }).then(res => {
        this.student_communication_type = res.keyValueList;
      });
    },
    
    // 获取时间
    dateFormat:function(time) {
    var date=new Date(time);
    var year=date.getFullYear();
    /* 在日期格式中，月份是从0开始的，因此要加0
     * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
     * */
    var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
    var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
    var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
    var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
    var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
    // 拼接
    return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
    },
    get_dataTime(){
      let dateTime= new Date()
      this.saveData.contractDate=this.dateFormat(dateTime)
    }
    
  },  
  mounted() {
    this.get_page_data()
    this.get_student_type()
    this.get_student_progress()
    this.get_contractType()
    this.get_dataTime()
  }
};
</script>
<style lang='scss' scoped>
.second-contain-box{
  width: 95%;
  margin: 0 auto;
  .el-col{
    text-align: left;
    margin: 20px 0;
  }
}
.inputbox{
  display: flex;
  flex-direction: row;
  span{
    display: block;
    width: 10%;
  }
  .el-input{
    width: 50%;
  }
  .el-textarea{
    float: left;
    margin-left: -4%;
  }
}

</style>
<style lang="scss">

</style>






